<template>
    <div class="configPage">
        <a-menu v-model="menuKey" mode="horizontal" @click="clickMenu">
            <a-menu-item key="common">
                通用设置
            </a-menu-item>
            <a-menu-item key="localPath">
                在PC上的视频
            </a-menu-item>
            <a-menu-item key="matchRule">
                匹配规则
            </a-menu-item>
        </a-menu>
        <div class="content">
            <Common v-show="curkey == 'common'" />
            <LocalPath :visible="curkey == 'localPath'" />
            <RuleInfo :visible="curkey == 'matchRule'" />
        </div>
    </div>
</template>
<script>
    import LocalPath from './local-path.vue'
    import RuleInfo from '@/components/rule-info/index.vue'
    import Common from './common.vue'
    export default {
        name: 'configPage',
        components: { LocalPath, RuleInfo, Common },
        data() {
            return {
                menuKey: ['common'],
                curkey: 'common',
            }
        },
        methods: {
            clickMenu({ key }) {
                this.curkey = key
            },
        },
    }
</script>
<style scoped lang="less">
    .configPage {
        .content {
            padding: 20px;
        }
    }
</style>
